<template>
	<view>
		<view class="cu-custom" :style="[{height:navBgImageHeight + 'px'}]">
			<image class="header-bg" :src="userInfo.background">
			</image>
			<view class="cu-bar fixed" :style="'height:'+navHeight+'px;padding-top:'+statusHeight+'px;'">
				<view @tap="backAction" class="padding-left flex align-center justify-start">
					<text class="cuIcon cuIcon-back text-white"></text>
					<text class="text-white text-lg">返回</text>
				</view>
			</view>
			<view :class="'cu-bar fixed '+themeColor"
				:style="'width:100%;height:'+navHeight+'px;padding-top:'+statusHeight+'px;opacity:'+navOpacity+';'">
				<view class="cu-bar fixed" :style="'height:'+navHeight+'px;padding-top:'+statusHeight+'px;'">
					<view @tap="backAction" class="padding-left flex align-center justify-start">
						<text class="cuIcon cuIcon-back text-white"></text>
						<text class="text-white text-lg">返回</text>
					</view>
				</view>
				<view class="flex justify-center align-center" style="width:100%;">
					<view class="cu-avatar round padding-right-sm"
						:style="'background-image: url('+userInfo.avatar+');'">
					</view>
					<text class="padding-left-sm text-white">{{userInfo.nickname}}</text>
					<view v-if="userInfo&&userInfo.role_id>0" class="padding-left-xs">
						<view class="radius cu-tag bg-orange sm">{{userInfo.role.name}}</view>
					</view>
				</view>
			</view>
		</view>
		<view class="info-card">
			<view class="avatar">
				<image class="avatar-img" :src="userInfo.avatar"></image>
				<image v-if="userInfo.sex!==-1" class="sex-icon bg-white round"
					:src="'../../static/images/setting/'+[userInfo.sex==0?'female':'male']+'.png'"></image>
			</view>
			<view class="name-box">
				<view class="flex justify-start align-start margin-left-xs" style="width: 100%;flex-direction: column;">
					<view class="flex justify-start align-center" style="width: 100%;">
						<text class="text-bold text-lg">{{userInfo.nickname}}</text>
						<view v-if="userInfo.group!==null" class="flex justify-start align-center padding-left-xs">
							<view class="radius cu-tag sm bg-gray text-grey">{{userInfo.group.name}}</view>
						</view>
						<view v-if="userInfo.role!==null" class="padding-left-xs">
							<view style="max-width: 65upx;" :class="'radius cu-tag sm bg-'+roleColor">
								{{userInfo.role.name}}
							</view>
						</view>
					</view>
					<view class="flex justify-between align-end" style="width: 100%;">
						<text :class="'text-gray '+[userId!=loginUserId?'':'padding-top-xs']">{{showJoinDate}}</text>
						<view v-if="userId!=loginUserId" class="flex justify-end align-center padding-right-sm"
							style="width: 60%;">
							<button @tap="sendMessageAction" class="cu-btn line-red round sm"
								style="width: 40%;">私信</button>
							<view style="width: 8px;"></view>
							<button @tap="attentionAction(1)" v-if="userInfo.is_attention==0"
								class="cu-btn bg-blue round sm" style="width: 55%;"><text
									class="cuIcon-add"></text>关注</button>
							<button @tap="attentionAction(0)" v-else-if="userInfo.is_attention==1"
								class="cu-btn bg-grey round sm" style="width: 55%;">已关注</button>
							<button @tap="attentionAction(0)" v-else-if="userInfo.is_attention==2"
								class="cu-btn bg-grey round sm" style="width: 55%;">互相关注</button>
						</view>
					</view>
				</view>
			</view>
			<view class="bottom-box">
				<view
					class="flex justify-between align-center solid-bottom padding-top-sm padding-bottom-sm padding-right-sm"
					style="width: 100%;">
					<view class="flex justify-start align-center">
						<text class="text-df">{{userInfo.area}}-{{userInfo.country}}</text>
						<view style="width: 40upx;"></view>
						<view v-if="userInfo.sign_status!==null"
							class="line-cyan flex justify-start align-center padding-xs">
							<image src="../../static/images/setting/sign_status.png"
								style="width: 30upx;height: 30upx;"></image>
							<view style="width: 4upx;"></view>
							<text class="text-cyan">{{userInfo.sign_status}}</text>
						</view>
					</view>
					<text class="text-xl text-bold">{{userInfo.score}}<text
							class="text-df count-tag-color tag-name">山竹</text></text>
				</view>
				<view v-if="userInfo"
					class="flex justify-between align-center padding-top padding-bottom padding-right-sm solid-bottom"
					style="width: 100%;">
					<text class="text-xl text-bold">{{format(userInfo.active_count)}}<text
							class="text-df count-tag-color tag-name">动态</text></text>
					<text class="text-xl text-bold">{{format(userInfo.post_count)}}<text
							class="text-df count-tag-color tag-name">帖子</text></text>
					<text class="text-xl text-bold">{{format(userInfo.fans_count)}}<text
							class="text-df count-tag-color tag-name">粉丝</text></text>
					<text class="text-xl text-bold">{{format(userInfo.attention_count)}}<text
							class="text-df count-tag-color tag-name">关注</text></text>
				</view>
				<view class="flex justify-start align-start padding-top-sm padding-bottom padding-right-sm"
					style="flex-direction: column;width: 100%;">
					<view class="flex justify-between align-center padding-bottom-sm" style="width: 100%;">
						<text class="text-df">Ta的标签</text>
						<text v-if="userInfo.hobby_label.length>4" class="text-gray">滑动查看</text>
					</view>
					<scroll-view v-if="userInfo.hobby_label.length > 0" scroll-x="true"
						style="white-space: nowrap;overflow: hidden;">
						<view v-for="(item,index) in userInfo.hobby_label" :key="index" style="display: inline-block;">
							<view v-if="index%2==0" class="padding-right">
								<view class="cu-tag line-orange round">
									{{item}}
								</view>
							</view>
							<view v-else class="padding-right">
								<view class="cu-tag bg-orange round">
									{{item}}
								</view>
							</view>
						</view>
					</scroll-view>
					<view v-else>
						<text class="text-gray">Ta太懒了，还没选择自己的标签~</text>
					</view>
				</view>
			</view>
		</view>
		<view style="height: 300upx;"></view>
		<view class="solid-bottom solid-top float-menu"
			:style="[scrollTop>=floatMenuFixedTop?'z-index:999;width: 100%;position:fixed;':'width: 100%;']+[scrollTop>=floatMenuFixedTop?'top:'+fixNavTop+'px;':'']">
			<scroll-view scroll-x class="bg-white nav" scroll-with-animation :scroll-left="scrollLeft">
				<view class="flex text-center">
					<view class="cu-item flex-sub text-df text-lg" :class="index==TabCur?'text-blue cur':''"
						v-for="(item,index) in navItems" :key="index" @tap="tabSelect" :data-id="index">
						{{item}}
					</view>
				</view>
			</scroll-view>
		</view>
		<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :up="upOption">
			<view v-for="(item,index) in dataList" :key="index">
				<post-item @clickTopic="clickTopicAction(item)" @clickForum="jumpToForumPostList(item)"
					:showForum="true" v-if="(item.show_type==1||item.show_type==4)&&TabCur==1"
					:showImage="item.show_type!==4" @click="jumpDetail(item)" :post="item"
					:isLast="index===dataList.length-1"></post-item>
				<post-item-title @clickForum="jumpToForumPostList(item)" :showForum="true"
					v-else-if="item.show_type==3&&TabCur==1" @click="jumpDetail(item)" :post="item"
					:isLast="index===dataList.length-1"></post-item-title>
				<post-item-image @clickTopic="clickTopicAction(item)" @clickForum="jumpToForumPostList(item)"
					:showForum="true" v-else-if="(item.show_type==5||item.show_type==6)&&TabCur==1"
					:showSummary="item.show_type==6" @click="jumpDetail(item)" :post="item"
					:isLast="index===dataList.length-1">
				</post-item-image>
				<active-post-item v-if="TabCur==0" :showCircle="true"
					@clickTopic="clickCircleTopicAction(item.circle_topic)" @delete="deleteAction(index)"
					@report="reportAction(index)"
					:showDelete="item.owner_id==userInfo.user_id||userInfo.owner_id==circle.owner_id||userInfo.role_id>0"
					@favorite="favoriteAction(index)" @praise="praiseAction(index)" @reward="rewardAction(index)"
					:index="index" @reply="replyComment" @loadMoreComment="loadMoreComment(index,item)"
					@expand="expandAction(index)" @commentAction="sendCommentAction(index,item)" :post="item"
					:circleOwnerId="circle.owner_id"
					@commentExpand="activeCommentExpand"
					></active-post-item>
				<circle-item v-if="TabCur==2" :circle="item"></circle-item>
				<list-user-item :showPostCount="true" :showFansCount="false"
					v-else-if="TabCur==3||TabCur==4" :userInfo="item"></list-user-item>
			</view>
		</mescroll-body>
		<input-panel @onReplySuccess="onReplySuccess" @onCommentSuccess="onCommentSuccess"
			:originInfo="inputPanelOriginInfo" @blur="showInputPanel=false" title="写评论" doneBtn="发表" :autoFocus="true"
			v-if="showInputPanel" class="input-panel"></input-panel>
		<score-pay :userInfo="loginUserInfo" :index="scorePostIndex" @chooseScore="chooseScoreAction"
			@hidden="showScorePay=false" v-if="showScorePay" ref="scorePay" class="input-panel"></score-pay>
		<view class="cu-modal" :class="form.modalStatus">
			<view class="cu-dialog">
				<view class="cu-bar bg-white justify-end">
					<view class="content">{{formTitle}}</view>
					<view class="action" @tap="form.modalStatus=''">
						<text class="cuIcon-close text-red"></text>
					</view>
				</view>
				<view class="padding-xl flex justify-start" style="flex-direction: column;">
					<view class="flex justify-center align-center padding-bottom-lg" style="width: 100%;">
						<textarea v-if="form.modalStatus.length > 0"
							class="bg-white radius padding-top padding-left text-left" v-model="form.textInput"
							placeholder="请输入内容"></textarea>
					</view>
					<view class="action flex justify-center padding bg-white" style="width: 100%;">
						<button @tap="commitOperateAction" class="cu-btn round bg-blue" style="width: 90%;">提交</button>
					</view>
				</view>
			</view>
		</view>
		<view class="cu-tabbar-height"></view>
	</view>
</template>

<script>
	import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
	import ActivePostItem from '@/components/active-post-item.vue';
	import InputPanel from '@/components/input-panel.vue'
	import ScorePay from '@/components/score-pay.vue';
	import ListUserItem from '@/components/list-user-item.vue';
	import PostItem from '@/components/post-item.vue';
	import PostItemTitle from '@/components/post-item-title.vue';
	import PostItemImage from '@/components/post-item-image.vue';
	import CircleItem from '@/components/circle-item.vue'
	import {
		getTagColorForRole,
		cutDateFromDateTime,
		getTimeDistance,
		formatCount
	} from '@/api/utils.js'
	import {
		checkLogin
	} from '@/js_sdk/checkLogin.js'
	import {
		isLogin,
		getUserInfo,
		setUserInfo,
		updateUserInfo
	} from '@/api/auth.js'
	import {
		getOtherUserInfo,
		attentionUser,
		getOtherUserFansList,
		getActivePostListByCircle,
		getCircleMemberList,
		getOtherUserPostList,
		getOtherActivePostList,
		getActivePostCommentList,
		getOtherAttentionList,
		getOtherUserCircleList,
		rewardOther,
		praise,
		favoritePost
	} from '@/api/api.js'
	import config from '@/api/config.js'
	export default {
		name: "My",
		mixins: [MescrollMixin],
		components: {
			ActivePostItem,
			InputPanel,
			ScorePay,
			ListUserItem,
			PostItem,
			PostItemImage,
			PostItemTitle,
			CircleItem
		},
		data() {
			return {
				floatMenuFixedTop: 340,
				upOption: {
					page: {
						size: 10 // 每页数据的数量,默认10
					},
					textNoMore: config.customNoMore,
					noMoreSize: 1, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
					empty: {
						tip: '暂无相关数据'
					}
				},
				form: {
					isPasswordJoin: false,
					isApply: false,
					modalStatus: '',
					reportPostId: '',
					textInput: '',
				},
				loginUserInfo: getUserInfo(),
				scorePostIndex: -1,
				showScorePay: false,
				inputPanelOriginInfo: null,
				showInputPanel: false,
				dataList: [],
				navItems: [
					'动态',
					'帖子',
					'圈子',
					'粉丝',
					'关注'
				],
				TabCur: 0,
				scrollLeft: 0,
				themeColor: this.ThemeColor,
				windowWidth: 320,
				windowHeight: 568,
				userId: null,
				userInfo: null,
				top: 0, //标题图标距离顶部距离
				opacity: 0.5,
				scrollTop: 0.5
			}
		},
		onLoad(options) {
			if (options.userId !== null && options.userId !== undefined && options.userId.length > 0) {
				this.userId = options.userId
				this.initUserInfo()
			}
			let _this = this
			uni.getSystemInfo({
				success(res) {
					console.log('window info:' + JSON.stringify(res))
					_this.windowWidth = res.windowWidth
					_this.windowHeight = res.windowHeight
				}
			})
		},
		onPageScroll(res) {
			this.scrollTop = res.scrollTop
			uni.$emit('ActivePostListDidSroll')
		},
		computed: {
			loginUserId() {
				if (isLogin() == false) {
					return 0
				}
				let loginUser = getUserInfo()
				return loginUser.user_id
			},
			formTitle() {
				if (this.form.isPasswordJoin) {
					return '请输入入圈口令'
				}
				if (this.form.isApply) {
					return '请输入加圈理由'
				}
				return '举报'
			},
			fixNavTop() {
				console.log('navHeight:' + this.navHeight)
				return this.CustomBar
			},
			score() {
				if (this.userInfo == null) {
					return 0
				}
				if (this.userInfo.score > 1000) {
					return (this.userInfo.score / 1000).toFixed(1) + 'k'
				}
				if (this.userInfo.score > 10000) {
					return (this.userInfo.score / 10000).toFixed(1) + 'w'
				}
				return this.userInfo.score
			},
			scoreName() {
				return config.scoreName
			},
			openPrivateMessage() {
				return config.privateMessageOpen == 1 ? true : false
			},
			isAttention() {
				if (isLogin() == false) {
					return false
				}
				if (this.userInfo == null) {
					return false
				}
				return this.userInfo.is_attention == 1 ? true : false
			},
			showJoinDate() {
				if (this.userInfo == null) {
					return ''
				}
				return cutDateFromDateTime(this.userInfo.created_at)
			},
			roleColor() {
				if (this.userInfo == null ||
					this.userInfo.role == null) {
					return 'white'
				}
				return getTagColorForRole(this.userInfo.role.role_id)
			},
			showMessageBtn() {
				let loginUserInfo = getUserInfo()
				if (isLogin() && loginUserInfo.user_id == this.userId) {
					return false
				}
				return true
			},
			navBgImage() {
				return 'https://static.lulingshuo.icodefuture.com/1618910351949'
			},
			navBgImageHeight() {
				return this.windowWidth * 0.8;
			},
			navHeight() {
				return this.CustomBar
			},
			statusHeight() {
				return this.StatusBar
			},
			navOpacity() {
				return this.scrollTop / (this.CustomBar + 140)
			},
			navBgFilter() {
				let scrollRate = Math.min(1, this.scrollTop / (this.CustomBar + 50))
				return (1 - scrollRate) * 2
			}
		},
		methods: {
			activeCommentExpand(passParams)
			{
				let postIndex = passParams[0]
				let commentIndex = passParams[1]
				let status = this.dataList[postIndex].comment_list[commentIndex].is_expand? false:true
				this.dataList[postIndex].comment_list[commentIndex].is_expand = status
			},
			onShareAppMessage(res) {
				if (res.from && res.from == "button") {
					if (res.target.dataset !== null && res.target.dataset !== undefined && res.target.dataset.postid !==
						undefined) {
						let dataset = res.target.dataset
						let circle = dataset.circle
						let author = dataset.author
						let postId = dataset.postid
						let title = "快来围观“@" + author + "”在圈子《" + circle + "》发表的精彩动态吧~"
						return {
							title: title,
							path: '/pages/lessuse/active-list/active-list?postId=' + postId + '&outside=1'
						}
					}
				}
				return {
					title: '快来TopicQ发现各种圈子的有趣内容吧～',
					path: '/pages/circle/circle?outside=1'
				}
			},
			onShareTimeline(res) {
				if (res.from && res.from == "button") {
					if (res.target.dataset !== null && res.target.dataset !== undefined && res.target.dataset.postid !==
						undefined) {
						let dataset = res.target.dataset
						let circle = dataset.circle
						let author = dataset.author
						let postId = dataset.postid
						let title = "快来围观“@" + author + "”在圈子《" + circle + "》发表的精彩动态吧~"
						return {
							title: title,
							path: '/pages/lessuse/active-list/active-list?postId=' + postId + '&outside=1'
						}
					}
				}
				return {
					title: '快来TopicQ发现各种圈子的有趣内容吧～',
					path: '/pages/circle/circle?outside=1'
				}
			},
			format(count) {
				return formatCount(count)
			},
			jumpToCircleProfile(circleId) {
				uni.navigateTo({
					url: '/pages/lessuse/circle-profile/circle-profile?circleId=' + circleId
				})
			},
			jumpToUserProfile(userId) {
				uni.navigateTo({
					url: '/pages/profile/profile?userId=' + userId
				})
			},
			getFloatMenuTop() {
				let that = this
				let query = uni.createSelectorQuery().in(this)
				query.select('.float-menu').boundingClientRect(data => {
					console.log("得到布局位置信息" + JSON.stringify(data));
					console.log("节点离页面顶部的距离为" + data.top);
					that.floatMenuFixedTop = data.top - that.CustomBar + 5
				}).exec()
			},
			backAction() {
				uni.navigateBack({
					delta: 1
				})
			},
			jumpToForumPostList(item) {
				uni.navigateTo({
					url: '/pages/lessuse/forum-post-list/forum-post-list?forumId=' + item.forum.forum_id +
						'&forumName=' + item.forum.name
				})
			},
			jumpDetail(post) {
				console.log(post)
				uni.navigateTo({
					url: '/pages/detail/detail?postId=' + post.post_id
				})
			},
			clickTopicAction(item) {
				console.log('topic is ' + item.topic.title);
				uni.navigateTo({
					url: '/pages/always/topic-post-list/topic-post-list?topicId=' + item.topic.topic_id,
					success: function(res) {
						res.eventChannel.emit('topicPostList', item.topic)
					}
				})
			},
			getRandomNum(Min, Max) {
				var Range = Max - Min;
				var Rand = Math.random();
				let rand = (Min + Math.round(Rand * Range));
				return rand
			},
			adjustShowType(post) {
				if (post.sort_index > 0) {
					return 3
				}
				if (post.image_list == null || post.image_list.length == 0) {
					if (post.summary.length < 15) {
						if (post.topic_id > 0) {
							return 1
						}
						return 3
					}
					return 4
				}
				if (post.link && post.link.indexOf('.mp4') !== -1) {
					return 1
				}
				if (post.image_list.length == 1) {
					return 1
				}
				//图片
				if (post.summary == null || post.summary.length < 15) {
					if (post.topic_id > 0) {
						return 1
					}
					let canTypes = [5, 6]
					let randomType = this.getRandomNum(0, 1);
					return canTypes[randomType]
				}
				if (post.image_list.length == 2) {
					let canTypes = [1, 5]
					if (post.comment_count < 10) {
						let randomType = this.getRandomNum(0, 1);
						return canTypes[randomType]
					}
					canTypes = [5, 6]
					let randomType = this.getRandomNum(0, 1);
					return canTypes[randomType]
				}
				if (post.image_list.length > 2) {
					let canTypes = [5, 6]
					let randomType = this.getRandomNum(0, 1);
					return canTypes[randomType]
				}
				return 1
			},
			clickCircleTopicAction(topic) {
				uni.navigateTo({
					url: '/pages/lessuse/circle-topic-post/circle-topic-post?topicId=' + topic.topic_id
				})
			},
			jumpToCircleTopicDetail(topic) {
				uni.navigateTo({
					url: '/pages/lessuse/circle-topic-post/circle-topic-post?topicId=' + topic.topic_id
				})
			},
			hiddenAndResetForm() {
				this.form.modalStatus = null
				this.form.textInput = ''
				this.form.isApply = false
				this.form.isPasswordJoin = false
			},
			realCancelCircle() {
				uni.showLoading({
					title: '正在退出...'
				})
				cancelCircle(this.circle.circle_id).then(res => {
					uni.hideLoading()
					uni.showToast({
						icon: 'none',
						title: '您已退出'
					})
					this.circle.is_joined = 0
				}).catch(error => {
					uni.hideLoading()
				})
			},
			realApplyJoin() {
				uni.showLoading({
					title: '正在提交...'
				})
				applyJoinCircle(this.circle.circle_id).then(res => {
					uni.hideLoading()
					uni.showToast({
						icon: 'none',
						title: '入圈成功!'
					})
					this.circle.is_joined = 1
				}).catch(error => {
					uni.hideLoading()
				})
			},
			commitOperateAction() {
				if (this.form.textInput.length == 0) {
					uni.showToast({
						icon: 'none',
						title: '请输入举报理由!'
					})
					return
				}
				uni.showLoading({
					title: '正在提交...'
				})
				reportPost(this.form.reportPostId, this.form.textInput).then(res => {
					uni.hideLoading()
					uni.showToast({
						title: '举报已提交'
					})
					this.form.modalStatus = null
				}).catch(error => {
					uni.hideLoading()
					uni.showToast({
						icon: 'none',
						title: '提交失败'
					})
				})
			},
			realDeleteActivePost(index) {
				uni.showLoading({
					title: '正在删除...'
				})
				let postId = this.dataList[index].post_id
				deleteActivePost(postId, this.circle.circle_id).then(res => {
					uni.hideLoading()
					uni.showToast({
						title: '删除成功!'
					})
					this.dataList.splice(index, 1)
				}).catch(error => {
					uni.hideLoading()
				})
			},
			deleteAction(index) {
				let that = this
				uni.showModal({
					title: '动态删除提示!',
					content: '动态删除后将无法找回，是否继续?',
					cancelText: '手滑了',
					confirmText: '确认删除',
					success: (res) => {
						if (res.confirm) {
							that.realDeleteActivePost(index)
						}
					}
				})
			},
			reportAction(index) {
				this.form.reportPostId = this.dataList[index].post_id
				this.form.modalStatus = 'show'
			},
			praiseAction(index) {
				let post = this.dataList[index]
				let oldStatus = post.is_praise
				let newStatus = post.is_praise == 1 ? 0 : 1
				this.dataList[index].is_praise = newStatus
				praise(post.post_id).then(res => {
					this.dataList[index].is_praise = newStatus
					if (newStatus == 1) {
						this.dataList[index].praise_count++
					} else {
						this.dataList[index].praise_count--
					}
					this.$forceUpdate()
				}).catch(error => {
					this.dataList[index].is_praise = oldStatus
				})
			},
			favoriteAction(index) {
				let post = this.dataList[index]
				let oldStatus = post.is_favorite
				let newStatus = post.is_favorite == 1 ? 0 : 1
				this.dataList[index].is_favorite = 1
				favoritePost(post.post_id).then(res => {
					this.dataList[index].is_favorite = newStatus
					if (newStatus == 1) {
						this.dataList[index].favorite_count++
					} else {
						this.dataList[index].favorite_count--
					}
					this.$forceUpdate()
				}).catch(error => {
					this.dataList[index].is_favorite = oldStatus
				})
			},
			chooseScoreAction(params) {
				let score = params[0]
				let index = params[1]
				let postId = this.dataList[index].post_id
				uni.showLoading({
					title: '正在提交...'
				})
				rewardOther(postId, score).then(res => {
					uni.hideLoading()
					uni.showToast({
						icon: 'none',
						title: '打赏成功'
					})
					this.showScorePay = false
					updateUserInfo()
					let that = this
					setTimeout(() => {
						that.loginUserInfo = getUserInfo()
					}, 300)
				}).catch(error => {

				})
			},
			rewardAction(index) {
				let otherUserId = this.dataList[index].author.user_id
				if (otherUserId == this.loginUserInfo.user_id) {
					uni.showToast({
						icon: 'none',
						title: '不要自己打赏自己哦~'
					})
					return
				}
				this.showScorePay = true
				this.scorePostIndex = index
			},
			onReplySuccess(params) {
				let postIndex = params[0]
				let comment = params[1]
				let commentList = [comment]
				this.dataList[postIndex].comment_count++
				this.dataList[postIndex].comment_list = commentList.concat(this.dataList[postIndex].comment_list)
			},
			onCommentSuccess(params) {
				let postIndex = params[0]
				let comment = params[1]
				let commentList = [comment]
				this.dataList[postIndex].comment_count++
				this.dataList[postIndex].comment_list = commentList.concat(this.dataList[postIndex].comment_list)
			},
			replyComment(params) {
				let post = this.dataList[params[0]]
				let comment = post.comment_list[params[1]]
				let info = {
					'postId': post.post_id,
					'commentId': comment.comment_id,
					'replyUser': comment.author.nickname,
					'postIndex': params[0]
				}
				this.inputPanelOriginInfo = info
				this.showInputPanel = true
			},
			loadMoreComment(index, post) {
				if (post.comment_load_finish) {
					return
				}
				let lastCommentId = post.comment_list[post.comment_list.length - 1].comment_id
				let num = 5
				getActivePostCommentList(post.post_id, lastCommentId, num).then(res => {
					post.comment_list = post.comment_list.concat(res.data)
					if (post.comment_list.length >= post.comment_count) {
						post.comment_load_finish = true
					}
				}).catch(error => {

				})
			},
			expandAction(index) {
				this.dataList[index].is_expand = !this.dataList[index].is_expand
			},
			sendCommentAction(index, post) {
				let info = {
					'postId': post.post_id,
					'postIndex': index
				}
				this.inputPanelOriginInfo = info
				this.showInputPanel = true
			},
			tabSelect(e) {
				this.TabCur = e.currentTarget.dataset.id;
				this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60
				this.dataList = []
				if (this.mescroll) {
					this.mescroll.triggerDownScroll()
				}
			},
			getDataList(pageIndex, pageSize) {
				if (this.TabCur == 1) {
					getOtherUserPostList(this.userId, pageIndex, pageSize).then(res => {
						res.data.list.forEach(item => {
							//最多显示三张图片
							if (item.image_list && item.image_list.length > 3) {
								item.image_list = item.image_list.slice(0, 3)
							}
							item.show_type = this.adjustShowType(item)
							if (item.image_list && item.image_list.length > 0) {
								item.icon = 'pic'
							}
							item.show_time = getTimeDistance(item.created_at)
						})
						let pageList = res.data.list
						if (pageIndex == 0) {
							this.dataList = pageList
						} else {
							this.dataList = this.dataList.concat(pageList);
						}
						console.log('page length:' + pageList.length)
						let hasNext = pageList.length >= pageSize
						if (this.mescroll) {
							this.mescroll.endSuccess(pageList.length, hasNext);
						}
					}).catch(error => {
						if (this.mescroll) {
							this.mescroll.endErr()
						}
					})
					return
				}
				if (this.TabCur == 2) {
					getOtherUserCircleList(pageIndex, pageSize, this.userId).then(res => {
						let pageList = res.data.list
						if (pageIndex == 0) {
							this.dataList = pageList
						} else {
							this.dataList = this.dataList.concat(pageList);
						}
						console.log('page length:' + pageList.length)
						let hasNext = pageList.length >= pageSize
						if (this.mescroll) {
							this.mescroll.endSuccess(pageList.length, hasNext);
						}
					}).catch(error => {
						if (this.mescroll) {
							this.mescroll.endErr()
						}
					})
					return
				}
				if (this.TabCur == 3) {
					getOtherUserFansList(this.userId, pageIndex, pageSize).then(res => {
						let pageList = res.data.list
						if (pageIndex == 0) {
							this.dataList = pageList
						} else {
							this.dataList = this.dataList.concat(pageList);
						}
						console.log('page length:' + pageList.length)
						let hasNext = pageList.length >= pageSize
						if (this.mescroll) {
							this.mescroll.endSuccess(pageList.length, hasNext);
						}
					}).catch(error => {
						if (this.mescroll) {
							this.mescroll.endErr()
						}
					})
					return
				}
				if (this.TabCur == 4) {
					getOtherAttentionList(pageIndex, pageSize, this.userId).then(res => {
						let pageList = res.data.list
						if (pageIndex == 0) {
							this.dataList = pageList
						} else {
							this.dataList = this.dataList.concat(pageList);
						}
						console.log('page length:' + pageList.length)
						let hasNext = pageList.length >= pageSize
						if (this.mescroll) {
							this.mescroll.endSuccess(pageList.length, hasNext);
						}
					}).catch(error => {
						if (this.mescroll) {
							this.mescroll.endErr()
						}
					})
					return
				}
				getOtherActivePostList(pageIndex, pageSize, this.userId).then(res => {
					res.data.list.forEach(item => {
						item.is_expand = false
						item.show_time = getTimeDistance(item.created_at)
						if (item.rich_content && item.rich_content.length > 0) {
							item.rich_content = JSON.parse(item.rich_content)
							item.is_rich_content = true
						}
						if(item.comment_list&&item.comment_list.length>0) {
							item.comment_list.forEach(comment=>{
								comment.is_expand = false
							})
						}
					})
					let pageList = res.data.list
					if (pageIndex == 0) {
						this.dataList = pageList
					} else {
						this.dataList = this.dataList.concat(pageList);
					}
					console.log('page length:' + pageList.length)
					let hasNext = pageList.length >= pageSize
					if (this.mescroll) {
						this.mescroll.endSuccess(pageList.length, hasNext);
					}
				}).catch(error => {
					if (this.mescroll) {
						this.mescroll.endErr()
					}
				})
			},
			downCallback() {
				if (this.mescroll) {
					this.mescroll.resetUpScroll()
				}
			},
			upCallback(page) {
				let pageIndex = page.num - 1
				this.getDataList(pageIndex, page.size)
			},
			attentionAction(status) {
				if (isLogin() == false) {
					let that = this
					uni.navigateTo({
						url: '/pages/login/login',
						events: {
							loginSuccess: function(data) {
								that.initUserInfo()
							}
						}
					})
					return
				}
				uni.showLoading({
					title: '正在提交...'
				})
				attentionUser(this.userInfo.user_id, status).then(res => {
					uni.hideLoading()
					this.userInfo.is_attention = status
					let tip = status == 1 ? '已关注' : '已取消'
					uni.showToast({
						title: tip
					})
				}).catch(error => {
					uni.hideLoading()
				})
			},
			initUserInfo() {
				if (this.userId === null || this.userId === undefined || this.userId.length == 0) {
					return
				}
				uni.showLoading({
					title: '正在加载...'
				})
				getOtherUserInfo(this.userId).then(res => {
					uni.hideLoading()
					if (res.data.hobby_label && res.data.hobby_label.length > 0) {
						res.data.hobby_label = JSON.parse(res.data.hobby_label)
					} else {
						res.data.hobby_label = []
					}
					this.userInfo = res.data
					let that = this
					this.$nextTick(function() {
						that.getFloatMenuTop()
					})
				}).catch(error => {
					uni.hideLoading()
				})
			},
			sendMessageAction() {
				if (isLogin() == false) {
					let that = this
					uni.navigateTo({
						url: '/pages/login/login',
						events: {
							loginSuccess: function(data) {
								that.initUserInfo()
							}
						}
					})
					return
				}
				uni.navigateTo({
					url: '/pages/always/conversation/conversation?toId=' + this.userId + '&toName=' + this
						.userInfo
						.nickname
				})
			}
		},

	}
</script>

<style scoped lang="scss">
	.detail-icon {
		width: 43upx;
		height: 43upx;
	}

	.header-bg {
		width: 100%;
		height: 100%;
		position: relative;
		z-index: 2;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.info-card {
		z-index: 99;
		border-top-left-radius: 10px;
		border-top-right-radius: 10px;
		background-color: #FFF;
		position: absolute;
		top: 450upx;
		left: 0px;
		width: 100%;
		height: 450upx;

		.avatar {
			position: absolute;
			top: -60upx;
			left: 15px;
			width: 166upx;
			height: 166upx;
			padding: 2px;
			display: flex;
			justify-content: center;
			align-items: center;
			background-color: #FFF;

			.avatar-img {
				width: 100%;
				height: 100%;
			}
		}

		.name-box {
			position: absolute;
			top: 5px;
			left: 200upx;
			width: calc(100% - 210upx);
			height: 40px;
		}

		.bottom-box {
			position: absolute;
			top: 110upx;
			left: 15px;
			width: calc(100% - 20px);
			height: 80px;

			.tag-name {
				padding-left: 2px;
			}
		}
	}


	.input-panel {
		position: fixed;
		height: 100%;
		width: 100%;
		bottom: 0%;
		z-index: 9999;
	}

	.sex-icon {
		z-index: 10;
		position: absolute;
		bottom: -8px;
		width: 18px;
		height: 18px;
	}

	.count-tag-color {
		color: #666;
	}
</style>
